<template>
  <div>
    <div>
      <card>
        <div class="flexCSB">
          <div style="display: flex; align-items: center">
            <Button :style="{marginRight:'20px'}" type="primary" @click="create">一键设置规则</Button>
            <!-- <Button :style="{marginRight:'20px'}" type="info" @click="downloadOldCode" :loading="loading24"
              >导出预约二维码</Button> -->
          </div>
        </div>
      </card>
      <card style="margin-top: 10px">
        <Tag color="red" style="margin: 10px 0; display: block">
          如果您要设置周几闭馆，只需要到预约配置中的闭馆设置下拉框中选择即可，对应周的预约规则无需删除。
        </Tag>
        <Table class="table" :loading="loading1" highlight-row :columns="columns" :data="data"></Table>
        <Modal :mask-closable="false" title="操作" v-model="modal" width="50">
          <Form ref="form" :model="newData" :label-width="160" width="50">
            <FormItem label="*星期：">
              <Select v-if='!bol' placeholder="请选择星期" v-model="newData.dayOfWeek">
                <Option v-for="item in weekList" :value="item.id" :key="item.id">{{ item.name }}</Option>
              </Select>
              <Select v-if="bol" multiple placeholder="请选择星期" v-model="newData.dayOfWeek1">
                <Option v-for="item in weekList" :value="item.id" :key="item.id">{{ item.name }}</Option>
              </Select>
            </FormItem>
            <!-- <FormItem label="最多预约几天内：">
              <InputNumber style="width: 100%" placeholder="请输入最多预约天数" :min="0" v-model="newData.mostDays">
              </InputNumber>
            </FormItem> -->
            <FormItem label="详细设置：">
              
              <template v-for="(item, key) in detailedSettings">
                <div style="display: flex; align-items: center" :key="key">
                  <el-select :disabled='!bol' v-model="item.dayType" placeholder="上午"  @change="onTypeChange">
                    <el-option v-for="typeItem in options" :key="typeItem.value" :label="typeItem.label" :value="typeItem.label">
                    </el-option>
                  </el-select>
                  <TimePicker :disabled='!bol' transfer format="HH:mm" type="timerange" :clearable="clearable"
                    placement="bottom-start" placeholder="请选择时间" style="width: 400px; margin: 5px 0"
                    v-model="item.sessionTime"></TimePicker>
                  <Input-number placeholder="请输入名额" style="width: 100px; margin: 10px 10px" :clearable="clearable"
                    :min="0" v-model="item.num"></Input-number>
                  <Icon v-if="!bol" type="ios-close-circle-outline" size="24" @click="del(key)"
                    style="margin-left: 10px; cursor: pointer" />
                  <Button v-if="bol" type="warning" style="width:100px;margin-top:5px;" @click="add(key)">添加一组</Button>
                  <!-- <Icon type="ios-plus-outline"

                size="24"
                  @click="add(key)"
                  style="margin-left: 10px; cursor: pointer"/> -->
                </div>
              </template>
            </FormItem>
            <!-- <Table
                class="table"
                highlight-row
                :columns="columns2"
                :data="newData.detailedSettings"
              ></Table> -->

          </Form>
          <div slot="footer">
            <Button type="warning" class="Button" @click="modal = false">关闭</Button>
            <Button type="success" class="Button" :loading="loading2" @click="submit">提交</Button>
          </div>
        </Modal>
        <Modal :mask-closable="false" title="详情" v-model="modal3" width="50">
          <Form ref="form" :model="newData" :label-width="160" width="50">
            <FormItem label="*星期：">
              <Select disabled placeholder="请选择星期" v-model="newData.dayOfWeek">
                <template v-for="item in weekList">
                  <Option :value="item.id">{{ item.name }}</Option>
                </template>
              </Select>
            </FormItem>
        
            <!-- <FormItem label="最多预约几天内：">
              <InputNumber disabled style="width: 100%" placeholder="请输入最多预约天数" :min="0" v-model="newData.mostDays">
              </InputNumber>
            </FormItem> -->
          
            <FormItem label="详细设置：">
             
              <template v-for="(item, key) in detailedSettings">
                <div style="display: flex; align-items: center" :key="key">
                  <TimePicker disabled transfer format="HH:mm" type="timerange" :clearable="clearable"
                    placement="bottom-start" placeholder="请选择时间" style="width: 400px; margin: 5px 0"
                    v-model="item.sessionTime"></TimePicker>
                  <Input-number disabled placeholder="请输入名额" style="width: 100px; margin: 10px 10px"
                    :clearable="clearable" :min="0" v-model="item.num">
                  </Input-number>                 
                </div>
              </template>
            </FormItem>
           

          </Form>
          <div slot="footer">
           
          </div>
        </Modal>
     
      </card>
    </div>
  
  </div>

</template>

<script>
  import axios from 'axios'
  // import QRCode from 'qrcodejs2'
  // import html2canvas from 'html2canvas'
  export default {
    data() {
      return {
     
        weeks: ['周一', '周二', '周三', '周四', '周五', '周六', '周日'],
   
        clearable: false,
      value:'上午',
        loading1: false,
        loading2: false,
      
        data: [],
         options: [{
          value: '0',
          label: '上午'
        }, {
          value: '1',
          label: '下午'
        }],
        // total: 0,
        columns: [{
            title: '星期',
            key: 'dayOfWeek2',
            align: 'center',
            minWidth: 150
          },
       
          // {
          //   title: '最多预约几天内',
          //   key: 'mostDays2',
          //   align: 'center',
          //   minWidth: 150
          // },
          {
            title: '总预约名额',
            key: 'amQuota2',
            align: 'center',
            minWidth: 150
          },
          {
            title: '操作',
            align: 'center',
            minWidth: 280,
            render: (h, params) => {
              return h('div', [
                h(
                  'Button', {
                    props: {
                      type: 'success'
                    },
                    style: {
                      marginRight: '10px'
                    },
                    on: {
                      click: () => {
                        this.update(params)
                      }
                    }
                  },
                  '修改'
                ),
              
                h(
                  'Button', {
                    props: {
                      type: 'warning'
                    },
                    style: {
                      marginRight: '10px'
                    },
                    on: {
                      click: () => {
                        this.detail(params)
                      }
                    }
                  },
                  '详情'
                ),
                h(
                  'Button', {
                    props: {
                      type: 'error'
                    },
                    on: {
                      click: () => {
                        this.delItem(params)
                      }
                    }
                  },
                  '删除'
                )
              ])
            }
          }
        ],
       
        newData: {
          amQuota: '',
          mostDays: '',
          // dayOfWeek: "",
          dayOfWeek: '',
          dayOfWeek1: [],
          detailedSettings: []
          // pmQuota: '',
          // quota: '',
          // time: ''
        },
        // id: '',
        weekList: [{
            id: 1,
            name: '星期一'
          },
          {
            id: 2,
            name: '星期二'
          },
          {
            id: 3,
            name: '星期三'
          },
          {
            id: 4,
            name: '星期四'
          },
          {
            id: 5,
            name: '星期五'
          },
          {
            id: 6,
            name: '星期六'
          },
          {
            id: 7,
            name: '星期日'
          }
        ],
        
        detailedSettings: [],
     
        modal: false,
        modal3: false,
       
        bol: true
      }
    },
    created() {
      // this.date[0] = this.getTime(new Date())
      // this.date[1] = this.getTime(
      //   new Date(new Date(this.date[0]).getTime() + 86400000 * 6)
      // )
      // this.time = [...this.date]
      // console.log(this.time)

      // if (this.$store.state.superAdmin == 'true') {
      //   this.getAppMuseumDropDown()
      // } else {
      //   this.museumName = this.$store.state.museumName
      //   if (this.$store.state.museums.length > 1) {
      //     this.museumId = this.$store.state.museumId
      //   } else {
      //     this.museumId = ''
      //   }
      this.getReservationMuseumRule()
      // this.getAppletsWxManager()
      // }
    },
    methods: {
      
      getReservationMuseumRule() {
        // if (this.$store.state.superAdmin == 'true') {
        //   for (let i = 0; i < this.museumList.length; i++) {
        //     if (this.museumId == this.museumList[i].id) {
        //       this.museumName = this.museumList[i].name
        //     }
        //   }
        // }
        this.loading1 = true
        this.$http(
          '/chongqing/stage/calendar-week-stock/getCalendarWeekStockList', {},
          'get',
          (res) => {
            console.log(res)
            if (res.data.code == 1000) {
              this.loading1 = false
              this.data = res.data.data
              for (let i = 0; i < this.data.length; i++) {
                switch (this.data[i].weeks) {
                  case 1:
                    this.data[i].dayOfWeek2 = '星期一'
                    break
                  case 2:
                    this.data[i].dayOfWeek2 = '星期二'
                    break
                  case 3:
                    this.data[i].dayOfWeek2 = '星期三'
                    break
                  case 4:
                    this.data[i].dayOfWeek2 = '星期四'
                    break
                  case 5:
                    this.data[i].dayOfWeek2 = '星期五'
                    break
                  case 6:
                    this.data[i].dayOfWeek2 = '星期六'
                    break
                  case 7:
                    this.data[i].dayOfWeek2 = '星期日'
                    break
                }

                if (this.data[i].stockNum != undefined) {
                  this.data[i].amQuota2 = this.data[i].stockNum + '人'
                }
                // if (this.data[i].pmQuota != undefined) {
                //   this.data[i].pmQuota2 = this.data[i].pmQuota + '人'
                // }
                // if (this.data[i].quota != undefined) {
                //   this.data[i].quota2 = this.data[i].quota + '人'
                // }
                // if (this.data[i].beforehandHour != undefined) {
                //   this.data[i].beforehandHour2 =
                //     this.data[i].beforehandHour + '小时'
                // }
                this.data[i].mostDays2 = this.data[i].futureDays + '天内'
              }
              // this.getAppletsWxManager()
              // this.getCalendarStocks(this.time)
            } else {
              this.loading1 = false
              this.$Message.error(res.data.msg)
            }
          }
        )
      },
      create() {
        this.id = ''
        this.bol = true
        this.detailedSettings = []
        this.detailedSettings.push({
          sessionTime: '',
          num: 0,
          dayType: '上午'
        })
        this.newData = {
          amQuota: '',
          mostDays: '',
          dayOfWeek1: [1, 2, 3, 4, 5, 6, 7],
          detailedSettings: []
          // pmQuota: '',
          // quota: '',
          // time: ''
        }

        console.log(this.newData.dayOfWeek, '123')
        // this.detailedSettings = []
        // this.$http('/stage/reservation/getReservationMuseumArrivalRangeDropdown', {
        //   museumId: this.museumId
        // }, 'get', (res) => {
        //   console.log(res)
        //   if (res.data.code == 200) {
        //     res.data.data.map(item => {
        //       this.detailedSettings.push({
        //         sessionTime: item.timeRange.split('-'),
        //         num: ''
        //       })
        //     })
        //   }
        // })
        this.modal = true
        console.log(this.modal)
      },
      detail(params) {
        console.log(params)
        // this.newData.dayOfWeek = null
        this.newData = {
          // mostDays: params.row.mostDays,
          dayOfWeek: params.row.weeks
          // time: [params.row.beginTime, params.row.endTime]
        }
        console.log(params)
        this.detailedSettings = []
        this.$http(
          '/chongqing/stage/calendar-week-stock/getCalendarWeekStockDetail', {
            week: params.row.weeks
          },
          'get',
          (res) => {
            console.log(res, 2222)
            if (res.data.code == 1000) {
              this.newData.mostDays = res.data.data.futureDays
              res.data.data.sessionTimes.map((item) => {
                this.detailedSettings.push({
                  sessionTime: item.sessionTime.split('-'),
                  num: item.stockNum,
                  dayType: item.dayType
                })
              })
            }
            console.log(this.detailedSettings);
          }
        )
        this.modal3 = true
      },
      update(params) {
        this.newData.dayOfWeek = null
        this.bol = false
        this.detailedSettings = []
        // this.id = params.row.id
        this.newData = {
          mostDays: params.row.futureDays,
          dayOfWeek: params.row.weeks
          // time: [params.row.beginTime, params.row.endTime]
        }
        console.log(params)
        // this.detailedSettings = []
        this.$http(
          '/chongqing/stage/calendar-week-stock/getCalendarWeekStockDetail', {
            week: params.row.weeks
          },
          'get',
          (res) => {
            console.log(res)
            if (res.data.code == 1000) {
              res.data.data.sessionTimes.map((item) => {
                this.detailedSettings.push({
                  sessionTime: item.sessionTime.split('-'),
                  num: item.stockNum,
                  dayType: item.dayType
                })
              })
            }
          }
        )
        this.modal = true
      },
      submit() {
        // return false
        console.log(this.newData)
        if (!this.newData.dayOfWeek && this.newData.dayOfWeek1.length == 0) {
          this.$Message.error('请输入星期')
          return false
        }
        // if (!this.newData.time[0]) {
        //   this.$Message.error('请选择开始时间和结束时间')
        //   return false
        // }
        let detailedSettings = []
        
        this.detailedSettings.map((item) => {
          detailedSettings.push({
            sessionTime: item.sessionTime[0] + '-' + item.sessionTime[1],
            stockNum: item.num,
            dayType:item.dayType
          })
        })
        let weeks = null
        if (this.bol) {
          weeks = this.newData.dayOfWeek1
        } else {
          weeks = this.newData.dayOfWeek
        }
        let data = {}
        console.log(detailedSettings)
        if (detailedSettings.length == 0) {
          this.$Message.error('场次不能为空')
          return false
        }
        for (let i = 0; i <= detailedSettings.length - 1; i++) {
          if (detailedSettings[i].sessionTime == 'undefined-undefined') {
            this.$Message.error('您有时间没填写，请填写后再提交')
            break
          } else {
            // debugger
            if (detailedSettings.length == i + 1) {
              if (this.bol) {
                data = {
                  // museumId: this.museumId,
                  futureDays: Number(0),
                  weeks: weeks,
                  sessionTimes: detailedSettings
                  // beginTime:
                  //     this.newData.time[0] == undefined ? '' : this.newData.time[0],
                  // endTime:
                  //     this.newData.time[0] == undefined ? '' : this.newData.time[1]
                }
              } else {
                data = {
                  // museumId: this.museumId,
                  futureDays:Number(0),
                  week: weeks,
                  sessionTimes: detailedSettings
                  // beginTime:
                  //     this.newData.time[0] == undefined ? '' : this.newData.time[0],
                  // endTime:
                  //     this.newData.time[0] == undefined ? '' : this.newData.time[1]
                }
              }
              this.loading2 = true
              if (this.bol) {
                this.$http(
                  '/chongqing/stage/calendar-week-stock/quickSetup',
                  data,
                  'post',
                  (res) => {
                    if (res.data.code == 1000) {
                      this.$Message.success('操作成功')
                      this.getReservationMuseumRule()
                      this.modal = false
                    } else {
                      this.$Message.error(res.data.msg)
                    }
                    this.loading2 = false
                  }
                )
              } else {
                this.$http('/chongqing/stage/calendar-week-stock/updateCalendarWeekStock',
                  data,
                  'post',
                  (res) => {
                    if (res.data.code == 1000) {
                      this.$Message.success('操作成功')
                      this.getReservationMuseumRule()
                      this.modal = false
                    } else {
                      this.$Message.error(res.data.msg)
                    }
                    this.loading2 = false
                  }
                )
              }
            }
          }
        }
        // detailedSettings.map((item, index) => {

        // });

        console.log(data)
      },
      add() {
        this.detailedSettings.push({
          sessionTime: [],
          num: 0
        })
      },
      // setup () {
      //   let arr = []
      // for(let i=0;i<this.newData.detailedSettings.length;i++){
      // 	arr.push({
      // 		num: this.newData.detailedSettings[i].num,
      // 		timeArea: [this.newData.detailedSettings[i].timeAreaStart , this.newData.detailedSettings[i].timeAreaEnd ]
      // 	})
      // }

      // if(this.id == ''){

      // }else{
      // 	for(let i=0;i<this.newData.detailedSettings.length;i++){
      // 		if(this.newData.detailedSettings[i].id){
      // 			arr.push({
      // 				id: this.newData.detailedSettings[i].id,
      // 				num: this.newData.detailedSettings[i].num,
      // 				timeArea: this.newData.detailedSettings[i].timeAreaStart.substring(0,5)+'-'+this.newData.detailedSettings[i].timeAreaEnd.substring(0,5)
      // 			})
      // 		}else{
      // 			arr.push({
      // 				num: this.newData.detailedSettings[i].num,
      // 				timeArea: this.newData.detailedSettings[i].timeAreaStart.substring(0,5)+'-'+this.newData.detailedSettings[i].timeAreaEnd.substring(0,5)
      // 			})
      // 		}
      // 	}
      // }
      // return false

      //   this.loading17 = true
      //   this.$http(
      //     '/stage/reservation/getReservationConfig',
      //     {
      //       museumId: this.museumId
      //     },
      //     'get',
      //     (res) => {
      //       this.loading17 = false
      //       if (res.data.code == 200) {
      //         this.arrivalPavilions = res.data.data.arrivalPavilions
      //         if (this.id == '') {
      //           for (let i = 0; i < this.arrivalPavilions.length; i++) {
      //             arr.push({
      //               num: '',
      //               timeArea: this.arrivalPavilions[i]
      //             })
      //           }
      //         } else {
      //           for (let i = 0; i < this.newData.detailedSettings.length; i++) {
      //             if (this.newData.detailedSettings[i].id) {
      //               arr.push({
      //                 id: this.newData.detailedSettings[i].id,
      //                 num: this.newData.detailedSettings[i].num,
      //                 timeArea:
      //                   this.newData.detailedSettings[i].timeAreaStart.substring(
      //                     0,
      //                     5
      //                   ) +
      //                   '-' +
      //                   this.newData.detailedSettings[i].timeAreaEnd.substring(
      //                     0,
      //                     5
      //                   )
      //               })
      //             } else {
      //               arr.push({
      //                 num: this.newData.detailedSettings[i].num,
      //                 timeArea:
      //                   this.newData.detailedSettings[i].timeAreaStart.substring(
      //                     0,
      //                     5
      //                   ) +
      //                   '-' +
      //                   this.newData.detailedSettings[i].timeAreaEnd.substring(
      //                     0,
      //                     5
      //                   )
      //               })
      //             }
      //           }
      //         }
      //         this.detailedSettings = arr
      //         this.modal2 = true
      //       } else {
      //         this.$Message.error(res.data.msg)
      //       }
      //     }
      //   )
      // },
      del(key) {
        this.detailedSettings.splice(key, 1)
      },
      // submit2 () {
      //   if (this.detailedSettings.length != 0) {
      //     if (this.detailedSettings.length != this.arrivalPavilions.length) {
      //       this.$Message.error('请确保详细设置时间段和到馆时间时间段一致')
      //       return false
      //     } else {
      //       for (let i = 0; i < this.detailedSettings.length - 1; i++) {
      //         for (let j = i + 1; j < this.detailedSettings.length; j++) {
      //           if (
      //             this.detailedSettings[i].timeArea ==
      //             this.detailedSettings[j].timeArea
      //           ) {
      //             this.$Message.error('详细设置时间段不能有重复的')
      //             return false
      //           }
      //         }
      //       }
      //       this.submit2Continue()
      //     }
      //   } else {
      //     this.submit2Continue()
      //   }
      // },
      // submit2Continue () {
      //   if (this.detailedSettings.length == 0) {
      //     this.modal2 = false
      //     this.newData.detailedSettings = []
      //   } else {
      //     for (let i = 0; i < this.detailedSettings.length; i++) {
      //       if (this.detailedSettings[i].timeArea.length == 0) {
      //         this.$Message.error('请确保表单填写完毕')
      //         return false
      //       }
      //     }
      //     let arr = []
      //     // return false
      //     for (let i = 0; i < this.detailedSettings.length; i++) {
      //       // arr.push({
      //       // 	num: this.detailedSettings[i].num,
      //       // 	timeAreaStart: this.detailedSettings[i].timeArea[0],
      //       // 	timeAreaEnd: this.detailedSettings[i].timeArea[1],
      //       // })
      //       if (this.detailedSettings[i].id) {
      //         arr.push({
      //           id: this.detailedSettings[i].id,
      //           num: this.detailedSettings[i].num,
      //           timeAreaStart:
      //             this.detailedSettings[i].timeArea.split('-')[0] + ':00',
      //           timeAreaEnd:
      //             this.detailedSettings[i].timeArea.split('-')[1] + ':00'
      //         })
      //       } else {
      //         arr.push({
      //           num: this.detailedSettings[i].num,
      //           timeAreaStart:
      //             this.detailedSettings[i].timeArea.split('-')[0] + ':00',
      //           timeAreaEnd:
      //             this.detailedSettings[i].timeArea.split('-')[1] + ':00'
      //         })
      //       }
      //     }
      //     this.modal2 = false
      //     this.newData.detailedSettings = arr
      //   }
      // },
      delItem(params) {
        this.$Modal.confirm({
          title: '提示',
          content: '<p>确定要删除此规则吗？</p>',
          onOk: () => {
            this.loading1 = true
            this.$http(
              '/chongqing/stage/calendar-week-stock/deleteCalendarWeekStock', {
                week: params.row.weeks
              },
              'get',
              (res) => {
                if (res.data.code == 1000) {
                  if (res.data.data) {
                    this.$Message.success('删除规则成功')
                  } else {
                    this.$Message.error('删除规则失败')
                  }
                  this.getReservationMuseumRule()
                } else {
                  this.$Message.error(res.data.msg)
                }
              }
            )
          }
        })
      },
      // download () {
      //   this.loading3 = true
      //   let that = this
      //   axios({
      //     method: 'get',
      //     url:
      //       this.color == '1'
      //         ? this.baseUrl + '/stage/qrCode/getQRCodeMerge'
      //         : this.baseUrl + '/stage/qrCode/getBlackQRCodeMerge',
      //     // url: this.baseUrl + '/stage/qrCode/generateReservationQRCode',
      //     headers: {
      //       token: this.$store.state.token || localStorage.getItem('token') || '',
      //       'Content-Type': 'application/json;charset=UTF-8'
      //     },
      //     responseType: 'blob',
      //     params: {
      //       museumId: this.museumId
      //     }
      //   })
      //     .then(function (res) {
      //       let blob = new Blob([res.data], {
      //         type: 'application/x-zip-compressed'
      //       })
      //       let objectUrl = URL.createObjectURL(blob)
      //       let a = document.createElement('a')
      //       a.href = objectUrl
      //       a.download = '文旅绿码'
      //       a.dispatchEvent(
      //         new MouseEvent('click', {
      //           bubbles: true,
      //           cancelable: true,
      //           view: window
      //         })
      //       )
      //       window.URL.revokeObjectURL(blob)
      //       that.loading3 = false
      //     })
      //     .catch((resp) => {
      //       that.loading3 = false
      //       that.$Message.error('导出二维码失败')
      //     })
      // },
      // download2 () {
      //   this.loading5 = true
      //   let that = this
      //   axios({
      //     method: 'get',
      //     url:
      //       this.color == '1'
      //         ? this.baseUrl + '/stage/qrCode/getQRCodeMerge'
      //         : this.baseUrl + '/stage/qrCode/getBlackQRCodeMerge',
      //     // url: this.baseUrl + '/stage/qrCode/generateSelfCheckQRCode',
      //     headers: {
      //       token: this.$store.state.token || localStorage.getItem('token') || '',
      //       'Content-Type': 'application/json;charset=UTF-8'
      //     },
      //     responseType: 'blob',
      //     params: {
      //       museumId: this.museumId
      //     }
      //   })
      //     .then(function (res) {
      //       let blob = new Blob([res.data], {
      //         type: 'application/x-zip-compressed'
      //       })
      //       let objectUrl = URL.createObjectURL(blob)
      //       let a = document.createElement('a')
      //       a.href = objectUrl
      //       a.download = '核销二维码'
      //       a.dispatchEvent(
      //         new MouseEvent('click', {
      //           bubbles: true,
      //           cancelable: true,
      //           view: window
      //         })
      //       )
      //       window.URL.revokeObjectURL(blob)
      //       that.loading5 = false
      //     })
      //     .catch((resp) => {
      //       that.loading5 = false
      //       that.$Message.error('导出二维码失败')
      //     })
      // },
      // getPassword () {
      //   this.loading4 = true
      //   this.$http(
      //     '/stage/reservation/getBindCheckerSecret',
      //     {
      //       museumId: this.museumId
      //     },
      //     'get',
      //     (res) => {
      //       this.loading4 = false
      //       if (res.data.code == 200) {
      //         if (res.data.data) {
      //           document.getElementById('qrcode').innerHTML = ''
      //           let qrcode = new QRCode('qrcode', {
      //             width: 365,
      //             height: 365,
      //             text: res.data.data + '/' + new Date().getTime()
      //           })
      //           // qrcode.clear()

      //           this.qrcodeModal = true
      //         } else {
      //           this.$Message.error('获取密钥失败')
      //         }
      //       } else {
      //         this.$Message.error(res.data.msg)
      //       }
      //     }
      //   )
      // },
      // copy (params) {
      //   this.detailedSettings = []
      //   this.id = ''
      //   this.newData = {
      //     amQuota: params.row.amQuota == undefined ? '' : params.row.amQuota,
      //     mostDays: params.row.mostDays,
      //     dayOfWeek: params.row.dayOfWeek,
      //     detailedSettings: [],
      //     // detailedSettings: params.row.detailedSettings == undefined ? [] : params.row.detailedSettings,
      //     pmQuota: params.row.pmQuota == undefined ? '' : params.row.pmQuota,
      //     quota: params.row.quota,
      //     time: [params.row.beginTime, params.row.endTime]
      //   }
      //   if (params.row.detailedSettings != undefined) {
      //     for (let i = 0; i < params.row.detailedSettings.length; i++) {
      //       this.newData.detailedSettings.push({
      //         num: params.row.detailedSettings[i].num,
      //         timeAreaEnd: params.row.detailedSettings[i].timeAreaEnd,
      //         timeAreaStart: params.row.detailedSettings[i].timeAreaStart
      //       })
      //     }
      //   }
      //   this.modal = true
      // },
      // setAllday () {
      //   this.newData.time = ['00:00:00', '23:59:59']
      // },
      // 微光扫码器规则设置
      // setUpWifi () {
      //   this.weiguangModal = true
      //   this.weiguangUrl = ''
      //   this.weiguangData = {
      //     wifiName: '',
      //     wifiPassword: ''
      //   }
      // },
      // 微光扫码器规则设置 - submit
      // weiguangSubmit () {
      //   if (!this.weiguangData.wifiName) {
      //     this.$Message.error('请输入wifi名称')
      //     return false
      //   }
      //   // if(!this.weiguangData.wifiPassword){
      //   // 	this.$Message.error('请输入wifi密码')
      //   // 	return false
      //   // }
      //   this.loading22 = true
      //   let that = this
      //   axios({
      //     method: 'post',
      //     url: this.baseUrl + '/stage/weiguang/setUpWifi',
      //     headers: {
      //       token: this.$store.state.token || localStorage.getItem('token') || '',
      //       'Content-Type': 'application/json;charset=UTF-8'
      //     },
      //     responseType: 'arraybuffer',
      //     data: {
      //       museumId: this.museumId,
      //       wifiName: this.weiguangData.wifiName,
      //       wifiPassword: this.weiguangData.wifiPassword
      //     }
      //   })
      //     .then(function (res) {
      //       that.loading22 = false
      //       let url =
      //         'data:image/PNG;base64,' + that.ArrayBufferToBase64(res.data)
      //       that.weiguangUrl = url
      //     })
      //     .catch((resp) => {
      //       that.loading22 = false
      //       that.$Message.error('下载失败')
      //     })
      // },
      // weiguangDownload () {
      //   const image = new Image()
      //   // 解决跨域 Canvas 污染问题
      //   image.setAttribute('crossOrigin', 'anonymous')
      //   image.onload = function () {
      //     const canvas = document.createElement('canvas')
      //     canvas.width = image.width
      //     canvas.height = image.height
      //     const context = canvas.getContext('2d')
      //     context.drawImage(image, 0, 0, image.width, image.height)
      //     const url = canvas.toDataURL('image/png') // 得到图片的base64编码数据
      //     const a = document.createElement('a') // 生成一个a元素
      //     const event = new MouseEvent('click') // 创建一个单击事件
      //     a.download = '微光扫码器二维码' // 设置图片名称
      //     a.href = url // 将生成的URL设置为a.href属性
      //     a.dispatchEvent(event) // 触发a的单击事件
      //   }
      //   image.src = this.weiguangUrl
      // },
      // getMpMenuConfig () {
      //   let that = this
      //   axios({
      //     method: 'get',
      //     url: this.baseUrl + '/stage/reservation/getMpMenuConfig',
      //     headers: {
      //       token: this.$store.state.token || localStorage.getItem('token') || '',
      //       'Content-Type': 'application/json;charset=UTF-8'
      //     },
      //     params: {
      //       museumId: this.museumId
      //     }
      //   }).then(function (res) {
      //     console.log(res)
      //     that.pagePath = res.data.data.pagePath
      //     that.alternatePage = res.data.data.alternatePage
      //     that.appid = res.data.data.appId
      //     that.router = true
      //   })
      // },
      // exportBindAdminQRCode () {
      //   this.loading23 = true
      //   let that = this
      //   axios({
      //     method: 'get',
      //     url: this.baseUrl + '/stage/reservation/exportBindAdminQRCode',
      //     headers: {
      //       token: this.$store.state.token || localStorage.getItem('token') || '',
      //       'Content-Type': 'application/json;charset=UTF-8'
      //     },
      //     responseType: 'arraybuffer',
      //     params: {
      //       museumId: this.museumId
      //     }
      //   })
      //     .then(function (res) {
      //       that.loading23 = false
      //       let url =
      //         'data:image/PNG;base64,' + that.ArrayBufferToBase64(res.data)
      //       that.adminImg = url
      //       that.adminModal = true
      //     })
      //     .catch((resp) => {
      //       that.loading23 = false
      //       that.$Message.error('下载失败')
      //     })
      // },
      downloadOldCode() {
        // this.loading24 = true
        // let that = this
        // axios({
        //   method: 'get',
        //   url: this.baseUrl + '/stage/qrCode/exportBookMuseumQrCode',
        //   headers: {
        //     token: this.$store.state.token || localStorage.getItem('token') || '',
        //     'Content-Type': 'application/json;charset=UTF-8'
        //   },
        //   responseType: 'blob',
        //   params: {
        //     museumId: this.museumId
        //   }
        // })
        //   .then(function (res) {
        //     let filename =
        //       res.headers['content-disposition'].split('filename=')[1]
        //     let blob = new Blob([res.data], {
        //       type: 'application/x-zip-compressed'
        //     })
        //     let objectUrl = URL.createObjectURL(blob)
        //     let a = document.createElement('a')
        //     a.href = objectUrl
        //     // a.download = "二码合一二维码"
        //     a.download = decodeURI(filename)
        //     a.dispatchEvent(
        //       new MouseEvent('click', {
        //         bubbles: true,
        //         cancelable: true,
        //         view: window
        //       })
        //     )
        //     window.URL.revokeObjectURL(blob)
        //     that.loading24 = false
        //   })
        //   .catch((resp) => {
        //     that.loading24 = false
        //     that.$Message.error('导出二维码失败')
        //   })
        const href = "http://test.static.bowu66.com/ztmuseum%2Fuploads%2FWechatLogo.jpeg";
        axios.get(href, {
          responseType: "blob"
        }).then((res) => {
          console.log(res);
          const blob = new Blob([res.data])
          const downloadElement = document.createElement('a')
          const href = window.URL.createObjectURL(blob)
          downloadElement.style.display = 'none'
          downloadElement.href = href
          downloadElement.download = '海报.png' // 下载后文件名
          document.body.appendChild(downloadElement)
          downloadElement.click() // 点击下载
          document.body.removeChild(downloadElement) // 下载完成移除元素
          window.URL.revokeObjectURL(href) // 释放掉blob对象
        })
      }
    }
  }

</script>

<style scoped>
  /* .select3 {
  margin-top: 20px;
} */
  /* .del {
  cursor: pointer;
}
.del:hover {
  color: #ed4014;
} */

  /* .codeModalClass3 {
  width: 1929px;
  position: relative;
  height: 2717px;
} */
  /* .codeModalClass1 {
  width: 2283px;
  position: relative;
  height: 3150px;
} */
  /* .codeModalClass4 {
  width: 2268px;
  position: absolute;
  height: 5102px;
} */
  /* .codeModalClass {
  width: 468px;
  position: relative;
  height: 693px;
} */
  /* .select {
  width: 100%;
  height: 40px; */
  /* background-color: rgb(172, 172, 172); */
  /* margin-bottom: 20px; */
  /* } */
  /* .btn2 {
  width: 140px;
  height: 40px; */
  /* background-color: red; */
  /* float: left;
  background-color: rgb(245, 247, 250);
  line-height: 40px;
  text-align: center;
  font-size: 16px;
}
.btn1 {
  width: 140px;
  height: 40px; */
  /* background-color: red; */
  /* float: left;
  background-color: white;
  line-height: 40px;
  text-align: center;
  font-size: 16px;
} */
  /* .museum_title {
  position: absolute;
  font-size: 76.39px;
  color: #2e2e2e;
  top: 972px;
  text-align: center;
  width: 100%;
  z-index: 2;
  font-weight: bold;
} */
  /* .museum_title3 {
  position: absolute;
  font-size: 63.89px;
  color: #2e2e2e;
  top: 840px;
  text-align: center;
  width: 100%;
  z-index: 2;
  font-weight: bold;
} */
  /* .museum_title4 {
  position: absolute;
  font-size: 110px;
  color: white;
  top: 2261px;
  text-align: center;
  width: 100%;
  z-index: 2;
  font-weight: bold;
} */

  /* .codeImg {
  position: absolute;
  width: 625px;
  height: 625px;
  z-index: 2;
  top: 1173px;
  left: 50%;
  margin-left: -312.5px;
} */
  /* .codeImg3 {
  position: absolute;
  width: 540px;
  height: 540px;
  z-index: 2;
  top: 1011px;
  left: 50%;
  margin-left: -270px;
} */
  /* .codeImg4 {
  position: absolute;
  width: 700px;
  height: 700px;
  z-index: 2;
  top: 2490px;
  left: 50%;
  margin-left: -350px;
} */
  /* .codeImg2 {
  position: absolute;
  width: 280px;
  height: 280px;
  z-index: 2;
  top: 215px;
  left: 50%;
  margin-left: -140px;
} */

  /* .flexCenter {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.flexCenter p {
  color: #ed4014;
  width: 100px;
  text-align: right;
  cursor: pointer;
  font-size: 14px;
}
.flexCenter p:hover {
  opacity: 0.8;
} */
  /* .newWarehouse {
  margin-left: 5px;
} */
  .table {
    margin-top: 0px;
  }

  /* .table >>> .ivu-table{
  margin-top: 0px !important;
} */
  /* .table1 { */
  /* display: flex; */
  /* margin-top: 15px; */
  /* overflow-x: scroll;
} */
  /* .neirong {
  width: 200px;
  height: 60px;
  transition: all 0.5s;
  display: flex;
  text-align: center;
  flex-direction: column;
  justify-content: center;
  border-bottom: 1px solid #ccc;
  background: #fff;
}
.neirong:hover {
  background-color: #ccc;
} */
  /* .table1 .column {
  width: 200px;
  display: table-cell;
  text-align: center;
  border-bottom: 1px solid #ccc;
}
.table1 .title {
  height: 40px;
  line-height: 40px;
  font-size: 18px;
  background-color: rgb(248, 249, 251);
} */
  /* .time, */
  /* .num {
  display: flex;

  align-items: center;
  justify-content: center;
  font-size: 16px;
} */
  /* .select3 {
  background: #fff;
  margin-top: 0px;
  padding: 10px 0;
} */
  /* .table1 {
  background: #fff;
  padding-top: 10px;
  padding-bottom: 10px; */
  /* position: absolute; */
  /* } */

</style>
